<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
                     <meta charset="utf-8">
         <meta http-equiv="content-Type" content="text/html; charset=utf-8" />
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript" src="/Static/lib/js/jquery-weui.js"></script>
    <script type="text/javascript" src="/Static/Shop/js/swiper.js"></script>
    <link rel="stylesheet" type="text/css" href="weui/lib/weui.css" />
    <link rel="stylesheet" type="text/css" href="weui/lib/weui.min.css">
     <link rel="stylesheet" type="text/css" href="weui/css/jquery-weui.css" />
    <link rel="stylesheet" type="text/css" href="weui/css/jquery-weui.min.css" />
    <link rel="stylesheet" href="demos/css/demos.css">
    <link rel="stylesheet" type="text/css" href="css/my.css" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>资料上传</title>
    </head>
    <body>

<form action="upload_tmp.php" method="post" enctype="multipart/form-data">
        <!-- <input type="file" name="myfile"> -->
<!-- 上面是泽维实现的文件上传功能 -->
<hr>
<!-- 下面是超超抄的排版，泽维把功能接上去 -->
 <div class="weui_cells weui_cells_form">
      <div class="weui_cell">
        <div class="weui_cell_bd weui_cell_primary">
          <div class="weui_uploader">
            <div class="weui_uploader_hd weui_cell">
              <div class="weui_cell_bd weui_cell_primary">文件上传</div>
              <div class="weui_cell_ft" id="uploads">上传文件数0/10</div>
            </div>
            <div class="weui_uploader_bd">
              <div class="weui_uploader_input_wrp" id="left" style="position:absoulte;display:block;">
                <input class="weui_uploader_input" type="file" name="myfile1" id="file" onchange=showImage();>
              </div>
              <div class="weui_uploader_input_wrp" id="left" style="position:absoulte;display:none;">
                <input class="weui_uploader_input" type="file" name="myfile2" id="file" onchange=showImage();>
              </div>
              <div class="weui_uploader_input_wrp" id="left" style="position:absoulte;display:none;">
                <input class="weui_uploader_input" type="file" name="myfile3" id="file" onchange=showImage();>
              </div>
              <div class="weui_uploader_input_wrp" id="left" style="position:absoulte;display:none;">
                <input class="weui_uploader_input" type="file" name="myfile4" id="file" onchange=showImage();>
              </div>
              <div class="weui_uploader_input_wrp" id="left" style="position:absoulte;display:none;">
                <input class="weui_uploader_input" type="file" name="myfile5" id="file" onchange=showImage();>
              </div>
              <div class="weui_uploader_input_wrp" id="left" style="position:absoulte;display:none;">
                <input class="weui_uploader_input" type="file" name="myfile6" id="file" onchange=showImage();>
              </div>
              <div class="weui_uploader_input_wrp" id="left" style="position:absoulte;display:none;">
                <input class="weui_uploader_input" type="file" name="myfile7" id="file" onchange=showImage();>
              </div>
              <div class="weui_uploader_input_wrp" id="left" style="position:absoulte;display:none;">
                <input class="weui_uploader_input" type="file" name="myfile8" id="file" onchange=showImage();>
              </div>
              <div class="weui_uploader_input_wrp" id="left" style="position:absoulte;display:none;">
                <input class="weui_uploader_input" type="file" name="myfile9" id="file" onchange=showImage();>
              </div>
              <div class="weui_uploader_input_wrp" id="left" style="position:absoulte;display:none;">
                <input class="weui_uploader_input" type="file" name="myfile10" id="file" onchange=showImage();>
              </div>
            </div>
          </div>
        </div>
  </div>
      <input type="submit" value="上传文件" style="width:60px;height:40px;margin:10px 0px 0px 15px;background:#dcdcdc;">
  </div>
  <div id="123" style="width:250px;height:50px;">当前上传文件路径:</div>
<script type="text/javascript">
//以下是jquery代码
    var i=0;
    var size=0;
    var s=1;

    $(document).ready(function(){
        var $a=$(".weui_uploader_input_wrp");
            for(var j=0;j<$a.length;j++){
                $a.eq(j).change(function(){
                  $a.eq(s-1).before("<img src='1.png'>");
                  $a.eq(s-1).css("display","none");
                  $a.eq(s).css("display","block");
                  s++;
                })
              }    
    })


    function showImage()
    {   
        i++;
        if(i>=10){
          i=10;
        }
        // 获取文件路径
        var path = $("#file").val();
        //显示文件路径
        var a=$("#123");
        a.html("上传文件路径"+path);
        //改变上传文件的文字显示数量
        $("#uploads").html("上传文件数:"+i+"/10");
    }
</script>
</form>
        <div class="weui_tabbar">
        <a href="index.html" class="weui_tabbar_item weui_bar_item_on">
          <div class="weui_tabbar_icon">
            <img src="./images/icon_nav_button.png" alt="">
          </div>
          <p class="weui_tabbar_label">下载</p>
        </a>

      
        <a href="send.html" class="weui_tabbar_item">
          <div class="weui_tabbar_icon">
            <img src="./images/icon_nav_cell.png" alt="">
          </div>
          <p class="weui_tabbar_label">上传</p>
        </a>
      </div>
    </body>
</html>